<template>
	<view class="center">
		<view class="user">
			<view class="bac">
				<view class="bacname" >
					<image class="imas" :src="userInfo.avatar" mode="aspectFit" @tap='$open("/pages/user/personal/personal")'></image>
					<view class="name">
						<text>{{userInfo.nickname}}</text>
						<view class="phone">
							<image src="../../static/images/s51.png" mode="widthFix"></image>
							<text>{{userInfo.mobile}}</text>
						</view>
					</view>
				</view>
				<text>{{userInfo.level == 0? '' :`${userInfo.levelname }：${userInfo.zk}折`}}</text>
			</view>
			<view class="hes">
				<view class="moivemony">
					<image src="../../static/images/s53.png" mode="widthFix" @tap='money'></image>
					<text>我的钱包</text>
				</view>
				<text>余额：{{userInfo.balance}}元</text>
			</view>
		</view>
		<view class="moant">
			<view class="userd">
				<text>我的订单</text>
				<view class="all" @tap='$open("/pages/user/order/order")'>
					<text>查看全部订单</text>
					<image src="../../static/images/s54.png" mode="widthFix"></image>
				</view>
			</view>
			<view class="classify">
				<view class="clasif" @tap='$open("/pages/user/order/order?order_status="+-1)'>
					<image src="../../static/images/s52.png" mode="widthFix"></image>
					<text>待支付</text>
				</view>
				<view class="clasif" @tap='$open("/pages/user/order/order?order_status="+1)'>
					<image src="../../static/images/s55.png" mode="widthFix"></image>
					<text>待收货</text>
				</view>
				<view class="clasif"  @tap='$open("/pages/user/order/order?order_status="+3)'>
					<image src="../../static/images/s56.png" mode="widthFix"></image>
					<text>已完成</text>
				</view>
				<view class="clasif" @tap='$open("/pages/user/order/order?order_status="+4)'>
					<image src="../../static/images/s57.png" mode="aspectFill"></image>
					<text>售后/退款</text>
				</view>
			</view>
		</view>
		<view class="upadte" @tap='update'>
			<text>修改密码</text>
			<image src="../../static/images/s54.png" mode="widthFix"></image>
		</view>
		<view class="upadte" @tap='opinion'>
			<text>意见反馈</text>
			<image src="../../static/images/s54.png" mode="widthFix"></image>
		</view>
		<view class="upadte" @tap='versions'>
			<text>关于</text>
			<image src="../../static/images/s54.png" mode="widthFix"></image>
		</view>
		<view class="loginout" @tap='loginout'>退出账号</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			userInfo:{},
			}
		},
		onLoad() {

		},
		onShow() {
					//用户信息
				this.users()	
			
		},
		methods: {
			//用户信息
			users(){
				this.$ajax(
				this.apiList.users,
				'POST',
				).then(res=>{
					this.userInfo = res.data
					console.log(res)
				})
			},
			money() {
				uni.navigateTo({
					url: 'money/money'
				})
			},
			update() {
				uni.navigateTo({
					url: 'password/password'
				})
			},
			opinion() {
				uni.navigateTo({
					url: 'opinion/opinion'
				})
			},
			versions() {
				uni.navigateTo({
					url: 'versions/versions'
				})
			},
			loginout() {
				this.$ajax(
				this.apiList.userLogout,
				'POST',
				).then(res=>{
					this.$sToast(res.msg)
					uni.clearStorageSync('userinfo')
						this.$open('../login/login',2,1500)	
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.center {
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		box-sizing: border-box;
		background-color: #eee;
		padding: 30upx;
		.user {
			width: 100%;
			box-sizing: border-box;
			.bac {
				display: flex;
				flex-direction: row;
				width: 100%;
				height: 120upx;
				background: url(../../static/images/s48.png) no-repeat;
				background-size: 100%;
				display: flex;
				justify-content: space-between;
				padding: 30upx;
				box-sizing: border-box;
				align-items: center;

				text {
					font-size: 24upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(54, 111, 56, 1);
				}

				.bacname {
					display: flex;
					.imas {
						display: inline-block;
					width: 80upx;
					border-radius: 50%;
					height: 80upx;
					}
					image{
						width: 80upx;
							margin-right: 20upx;
			
					}

					.name {
						display: flex;
						flex-direction: column;
						justify-content: center;

						text {
							font-size: 24upx;
							font-family: PingFang SC;
							font-weight: 400;
							color: rgba(54, 111, 56, 1);
						}

						.phone {
							padding-top: 10upx;
							display: flex;
							align-items: center;

							image {
								width: 14upx;
							}
						}
					}
				}
			}

			.hes {
				width: 100%;
				height: 88upx;
				background: url(../../static/images/s49.png) no-repeat;
				background-size: 100%;
				display: flex;
				justify-content: space-between;
				padding: 30upx;
				box-sizing: border-box;

				.moivemony {
					display: flex;

					image {
						width: 52upx;
						margin-right: 10upx;
					}

					text {
						font-size: 20upx;
						font-family: PingFang SC;
						font-weight: 400;
						color: rgba(54, 111, 56, 1);
					}
				}

				text {
					font-size: 20upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(54, 111, 56, 1);
				}
			}
		}

		.moant {
			width: 100%;
			box-sizing: border-box;
			background: #fff;
			border-radius: 10upx;
			margin-top: 20upx;

			.userd {
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1upx solid #ccc;
				padding: 20upx;

				text {
					font-size: 28upx;
					font-family: PingFang SC;
					font-weight: 400;
				}

				.all {
					text {
						font-size: 20upx;
						font-family: PingFang SC;
						font-weight: 400;
						color: rgba(189, 189, 189, 1);
						margin-right: 10upx;
					}

					image {
						width: 13upx;
					}
				}
			}
		}

		.classify {
			width: 100%;
			box-sizing: border-box;
			padding: 40upx;
			display: flex;
			justify-content: space-around;

			.clasif {
				display: flex;
				flex-direction: column;
				align-items: center;

				image {
					display: block;
					width: 80upx;
					height: 80upx !important;
					margin-bottom: 20upx;
				}

				text {
					font-size: 20upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(33, 33, 33, 1);
				}

			}
		}

		.upadte {
			width: 100%;
			background: #fff;
			border-radius: 10upx;
			margin-top: 20upx;
			padding: 20upx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			box-sizing: border-box;

			text {
				font-size: 28upx;
				font-family: PingFang SC;
				font-weight: 400;
				color: rgba(33, 33, 33, 1);
			}

			image {
				width: 13upx;
			}
		}

		.loginout {
			display: block;
			width: 690upx;
			height: 80upx;
			box-sizing: border-box;
			background: #13CA62;
			border-radius: 10upx;
			color: #fff;
			font-size: 28upx;
			text-align: center;
			line-height: 80upx;
			font-family: PingFang SC;
			position: fixed;
			left: 4%;
			margin-top: 25%;
		}
	}
</style>
